﻿<UserControl x:Class="Boggle.Net.Views.TrayView"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
        xmlns:cal="http://www.caliburnproject.org" 
        xmlns:Converters="clr-namespace:Boggle.Net.Converters" 
        xmlns:Controls="clr-namespace:Boggle.Net.Controls"
        Focusable="false"
        >

    <UserControl.Resources>
        <ResourceDictionary>
            <ResourceDictionary.MergedDictionaries>
                <ResourceDictionary Source="..\Styles\Styles.xaml" />
            </ResourceDictionary.MergedDictionaries>

            <Converters:TrayPathToPointCollectionConverter x:Key="TrayPathToPointCollectionConverter" />

            <Style x:Key="PathStyle" TargetType="{x:Type Controls:ArrowPolyLine}">
                <Setter Property="Stroke" Value="Crimson" />
                <Setter Property="Opacity" Value="0.8" />
                <Setter Property="StrokeThickness" Value="5" />
                <Setter Property="StrokeLineJoin" Value="Miter" />
                <Setter Property="StrokeEndLineCap" Value="Triangle" />
                <Setter Property="IsHitTestVisible" Value="False" />
            </Style>

            <Style x:Key="TrayButton" TargetType="{x:Type ToggleButton}">
                <Setter Property="FontSize" Value="32" />
                <Setter Property="VerticalContentAlignment" Value="Center" />
                <Setter Property="HorizontalContentAlignment" Value="Center" />
                <Setter Property="Foreground" Value="White" />
                <Setter Property="Background" Value="{StaticResource DieBrush}" />

                <Setter Property="Template">
                    <Setter.Value>
                        <ControlTemplate TargetType="{x:Type ToggleButton}">
                            <Border CornerRadius="2" Padding="0,0,0,8" Margin="2" Background="{StaticResource BackgroundBrush}" >
                                <Grid>
                                    <Grid.RowDefinitions>
                                        <RowDefinition/>
                                        <RowDefinition/>
                                    </Grid.RowDefinitions>
                                    <ContentPresenter 
                                        x:Name="Content"
                                        Grid.RowSpan="2"
                                        Content="{TemplateBinding Content}" 
                                        HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" />
                                    <!--<TextBlock Text="{TemplateBinding Content}" 
                                        FontSize="32" 
                                        Foreground="Gold"  
                                        TextAlignment="Center" 
                                        VerticalAlignment="Center" 
                                        Grid.RowSpan="2"
                                    />-->

                                    <!--<Border CornerRadius="2" Margin="1">
                                        <Border.Background>
                                            <LinearGradientBrush StartPoint="0.5,0" EndPoint="0.5,1" Opacity="0.5">
                                                <GradientStop Color="#40FFFFFF" />
                                                <GradientStop Color="#80FFFFFF" Offset="0.2" />
                                            </LinearGradientBrush>
                                        </Border.Background>
                                    </Border>-->
                                </Grid>
                            </Border>
                        
                            <ControlTemplate.Triggers>
                                <Trigger Property="IsChecked" Value="True">
                                    <Setter Property="Foreground" Value="Gold" />
                                </Trigger>
                                <MultiTrigger>
                                    <MultiTrigger.Conditions>
                                        <Condition Property="IsChecked" Value="False" />
                                        <Condition Property="IsEnabled" Value="False" />
                                    </MultiTrigger.Conditions>
                                    <Setter TargetName="Content" Property="Opacity" Value="0.5" />
                                </MultiTrigger>
                            </ControlTemplate.Triggers>
                        </ControlTemplate>
                    </Setter.Value>
                </Setter>
            </Style>

            <DataTemplate x:Key="TrayItemTemplate">
                <ToggleButton IsEnabled="{Binding IsEnabled}" IsChecked="{Binding IsSelected}" Content="{Binding Letter}" Style="{StaticResource TrayButton}" />
                <!--
                <Border CornerRadius="2" Padding="2,2,2,6" Margin="2" Background="{StaticResource DieBrush}">
                    <TextBlock Text="{Binding Letter}" 
                               FontSize="32" 
                               Foreground="{StaticResource TextBrush}"  
                               TextAlignment="Center" 
                               VerticalAlignment="Center" 
                               />
               
                </Border>
                -->
            </DataTemplate>

            <ItemsPanelTemplate x:Key="TrayPanelTemplate">
                <UniformGrid Columns="4" />
            </ItemsPanelTemplate>
        
            <Style x:Key="TrayStyle" TargetType="{x:Type ItemsControl}">
                <Setter Property="ItemTemplate" Value="{StaticResource TrayItemTemplate}" />
                <Setter Property="ItemsPanel" Value="{StaticResource TrayPanelTemplate}" />
                <Setter Property="Focusable" Value="false" />
            </Style>

        </ResourceDictionary>
    </UserControl.Resources>
        
    <Grid x:Name="TrayHost" IsEnabled="{Binding IsEnabled}" Height="{Binding ActualWidth, RelativeSource={RelativeSource Self}}" >
        <ItemsControl Style="{StaticResource TrayStyle}" ItemsSource="{Binding CellList}">
            <ItemsControl.ContextMenu>
                <ContextMenu>
                    <MenuItem Header="_Copy" cal:Message.Attach="CopyToClipboard" />
                </ContextMenu>
            </ItemsControl.ContextMenu>
        </ItemsControl>

        <Controls:ArrowPolyLine Style="{StaticResource PathStyle}" >
            <Controls:ArrowPolyLine.Points>
                <MultiBinding Converter="{StaticResource TrayPathToPointCollectionConverter}">
                    <Binding Path="TracedPlay.Path" />
                    <Binding ElementName="TrayHost" Path="ActualWidth" />
                    <Binding ElementName="TrayHost" Path="ActualHeight" />
                </MultiBinding>
            </Controls:ArrowPolyLine.Points>
        </Controls:ArrowPolyLine>
    </Grid>
</UserControl>
